<template>
  <em class="badge">
    {{ number }}
  </em>
</template>

<script>
export default {
  name: 'badge',
  props: {
    /**
    * 消息数量
    */
    number: {
      type: Number
    }
  }
};
</script>


<style lang="scss" scope>
@import '../assets/style/config';
@import '../assets/style/mixins/common';
em.badge {
  font-size: 1.2rem;
  color: $write-color;
  background: $color;
  height: 1.6rem;
  line-height: 1.6rem;
  min-width: 1.6rem;
  padding: 0 .2rem;
  border-radius: 9999px;
  text-align: center;
}
</style>